<template>
	<view class="">
		<ul>
			<li v-for="(item, index) in shopList" :key="index" class="pd-10 order-list margin-bottom_10">
				<view class="flex justify-between margin-bottom_10">
					<info :infoData="item" :props="{ name: 'nickname', time: 'add_time' }"></info>
					<view class="gray order-status darkColor2">
						<text v-if="item.withdraw_state == 0">待结算</text>
						<text v-if="item.withdraw_state == 1">已结算</text>
					</view>
				</view>
				<block v-for="(itm, idx) in item.sellList" :key="idx">
					<view class="flex margin-bottom_10"  @click="shopDetails(itm.dis_goods_id)">
						<view class="product-picture"><image class="img" :src="itm.image_path"></image></view>
						<view class="flex-1">
							<view>{{ itm.goods_name }}</view>
							<view class="flex justify-between">
								<view>
									<text class="gray">商品价格</text>
									<text class="darkColor">￥</text>
									<text class="darkColor">{{ itm.total_amount }}</text>
								</view>
								<view>
									<text class="gray">佣金</text>
									<text class="darkColor">￥</text>
									<text class="darkColor">{{ itm.amount_commission }}</text>
								</view>
							</view>
						</view>
					</view>
				</block>
				<view class="flex justify-between items-center">
					<view class="gray">订单编号：{{ item.order_no }}</view>
					<view class="copy gray border-25" @click.stop="copy(item.order_no)">复制</view>
				</view>
				<view v-if="item.withdraw_state == 1 && item.settlement_date" class="flex justify-between">
					<view class="gray">结算日期：{{ item.settlement_date }}</view>
				</view>
				<view v-if="item.withdraw_state == 0 && item.expect_time" class="flex justify-between">
					<view class="gray">预计结算日期：{{ item.expect_time }}</view>
				</view>
			</li>
		</ul>
	</view>
</template>

<script>
import info from './info.vue';
export default {
	components: {
		info
	},
	inject: {
		size: {
			type: String,
			default: '130'
		}
	},
	props: {
		shopList: {
			type: Array,
			default: () => {
				return [];
			}
		}
	},
	mounted() {
		console.log(this.shopList, 'shopList');
	},
	methods: {
		shopDetails(id) {
			this.$emit('details', id);
		},
		copy(order_no){
			uni.setClipboardData({
			    data: order_no,
			    success: function () {
			        uni.showToast({
			        	title: '单号已复制'
			        })
			    }
			});
		}
	}
};
</script>

<style lang="less" scoped>
@import '@/common/index.less';

.avatar {
	width: 120rpx;
	height: 120rpx;
	margin-right: 15rpx;
}
.product-picture {
	width: 180rpx;
	height: 180rpx;
	margin-right: 15rpx;
	.img {
		border-radius: @border-radius-ms;
	}
}
.order-list {
	border-radius: 15rpx;
	background-color: #fff;
	.nickname {
		max-width: 300rpx;
		margin-bottom: 10rpx;
	}
	.gray {
		font-size: 28rpx;
		margin-right: 10rpx;
	}
	.darkColor {
		font-size: 32rpx;
		font-weight: 600;
	}
}
.darkColor2 {
	color: #f93b3f;
}
.order-status {
	transform: translateY(15rpx);
}
.copy {
	border: 1px solid @gray;
	font-size: 24rpx;
	padding: 5rpx 14rpx;
}
</style>
